<template>
    <a-row>

        <a-col :span="10">

            <a-input-number id="inputNumber"
                            :min="1"
                            v-model="val"
                            @change="onChangeValue"  />

        </a-col>
        <a-col :span="14">

            <a-radio-group v-model="unit" @change="onChangeUtil">
                <a-radio value="M">
                    分钟
                </a-radio>
                <a-radio value="H">
                    小时
                </a-radio>

            </a-radio-group>

        </a-col>
    </a-row>
</template>

<script>
    export default {
        props: ['minutes'],
        data() {
            return {
                val: null,
                unit: 'H',

            }
        },
        methods: {
            fmtTime(val) {
                if(this.minutes ){
                if (val % 60 === 0 && val > 60) {
                    this.unit = 'H'
                    this.val = val / 60;
                } else {
                    this.unit = 'M'
                    this.val = val;
                }

                }
            },


            onChangeValue(){
                let miutes=null;
                if(this.val&&this.val>0) {

                    if (this.unit === 'M') {
                        miutes = this.val;
                    } else {
                        miutes = this.val * 60;
                    }

                }
                this.$emit("callBack",miutes);
            },

            onChangeUtil(e){
                let miutes=null;

                if(this.val&&this.val>0){




                if(e.target.value==='M'){
                    miutes=this.val;
                }else{
                    miutes=this.val*60;
                }

                }
                this.$emit("callBack",miutes);
            }

        },



        created() {

           this.fmtTime(this.minutes );
        },


    }
</script>

<style scoped>

</style>
